<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ include file="/WEB-INF/pages/views/taglib.jsp"%>

<html>
<head>
    <title>首页展示</title>
    <link id="vendor" rel="stylesheet" href="${ctxStatic}/css/vendor.css">
    <link id="theme" rel="stylesheet" href="${ctxStatic}/css/ui-light.css">

    <link rel="stylesheet" href="${ctxStatic}/css/bootstrap.min.css">
    <script src="${ctxStatic}/jquery/jquery-1.9.1.min.js"></script>
    <script src="${ctxStatic}/jquery/bootstrap.js"></script>

    <style type="text/css">
        .loading{
            width:160px;
            height:56px;
            position: absolute;
            top:50%;
            left:50%;
            line-height:56px;
            color:#fff;
            padding-left:60px;
            font-size:15px;
            background: #000 url(${ctxStatic}/image/load.gif) no-repeat 10px 50%;
            opacity: 0.7;
            z-index:9999;
            -moz-border-radius:20px;
            -webkit-border-radius:20px;
            border-radius:20px;
            filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
        }

        .footers {
            right: 0;
            bottom: 0;
            left: 0;
            padding: 15px;
            background-color: #ccd1d3;
        }
    </style>
  <%--  <script src="https://cdn.bootcss.com/showdown/1.3.0/showdown.min.js"></script>--%>

    <script>
        function inDetailedPage(fileName ,templatesType){
            var url = "${pageContext.request.contextPath}/DetailedCon?Catalog="+fileName+"&templatesType="+templatesType;
            window.open(url, "_self");
        }

        function inAppDelete(cata,tmp){

            var result = confirm('是否删除！');
            if(!result){return;}

            $("#loading").toggle();
            var path  = "${ctx}/IndexCon/appDelete";
            $.ajax({
                type: "POST",
                url: path,
                data:{
                    "catalog":cata,
                    "templatesType":tmp
                },
                datatype: 'text',
                cache: false,
                success: function(data) {
                    $("#loading").toggle();
                    console.log(data);
                    if(data == 'success') {
                        alert("提交成功");
                    }else  {
                        alert("操作失败");
                    }
                    //alert(data.desc);
                    location.reload();
                },
                error: function(){    //调用出错执行的函数
                    alert("网络出现问题，请刷新界面。或者联系管理人员"); //请求出错处理
                }
            });
        }
    </script>
</head>
<body  class="no-touch ember-application theme-ui-light" >
<div id="loading" class="loading" style="display:none">Loading pages...</div>
<!-- 头部 -->
<header id="ember830" class="ember-view clearfix no-select">

    <nav class="navbar clearfix">
        <div class="container-fluid">
            <div class="navbar-header">
                <ul class="nav">
                    <li>
                        <button class="navbar-brand logo btn">
                        </button>
                    </li>

                    <li class="btn dropdown project-btn r-p0 ">
                        <a id="environment-dropdown" role="button" href="/GitHubTest/IndexCon"
                           class="btn btn-link dropdown-toggle text-left" aria-haspopup="true" aria-expanded="false"
                           aria-label="环境">
                            <span class="clip"> <i class="icon icon-home project-icon icon-fw">  </i>  &nbsp;应用商店 </span>    </a>
                    </li>
                </ul>
            </div>

        </div>
    </nav>

</header>


<!-- 中部 -->
<section class="header clearfix">
    <h1> 应用商店 <span class="text-capitalize">all </span> </h1>
</section>
<section class="r-plr15 clearfix">
    <c:forEach items="${list}" var="appList" varStatus="scot" >
        <div id="" class="ember-view catalog-box">
          　<div class="catalog-icon"><img src="../${appList.svgPath}"></div>
            <div class="itemwrap">
                <h5> ${appList.fileName} </h5>
                <hr class="r-m10">
                <div class="r-mt10 description">暂无描述</div>
                <div class="footer">
                    <button type="button" class="btn btn-sm btn-primary" data-ember-action="2003"
                            onclick="inDetailedPage('${appList.fileName}','${appList.templatesType}')">
                        View Details
                    </button>
                    <button type="button" class="btn-sm btn-warning" data-ember-action="2003"
                            onclick="inAppDelete('${appList.fileName}','${appList.templatesType}')">
                        App Deletes
                    </button>
                </div>
            </div>
        </div>
    </c:forEach>
</section>

<br/>
<section class="r-plr15 clearfix">

</section>
<%--<div class="container" >
    <h1> ##<span class="text-capitalize">README.md </span> ##</h1>
    ${appReadme}
    <br/><br/><br/><br/><br/>
</div>--%>


<!-- 底部 -->
<div class="footers">
    <a href="" class="btn btn-sm btn-link" aria-label="About Rancher" data-ember-action="1807"> v1.5.3 </a>
    <a role="button" class="btn btn-sm btn-link" href="">  帮助   </a>
    <a role="button" class="btn btn-sm btn-link" target="blank" >  文档    </a>
    <a role="button" class="btn btn-sm btn-link" target="blank" >  提交问题 </a>
    <a role="button" class="btn btn-sm btn-link" target="blank" href="https://forums.rancher.com/">  论坛   </a>
    <a role="button" class="btn btn-sm btn-link" target="blank" href="https://slack.rancher.io/">  Slack   </a>
    <div class="pull-right">
        <div class="compose-download inline-block">
            <a class="dropdown-toggle hand btn btn-sm btn-link" data-toggle="dropdown"
               aria-expanded="false">
                <i class="icon icon-download"> </i>
                下载CLI
                <i class="icon icon-chevron-down"> </i>
            </a>
        </div>
    </div>
    <div class="pull-right">
        <div id="ember1824" class="ember-view dropdown language-dropdown inline-block">
            <a class="dropdown-toggle hand btn btn-sm btn-link lang-select" data-toggle="dropdown"
               aria-expanded="false">
                <i class="icon icon-globe">
                </i>
                简体中文
                <i class="icon icon-chevron-down">
                </i>
            </a>
        </div>
    </div>
</div>



</body>
</html>
